<template>
  <div>
  	<el-row type="flex" justify="center">
  					
  			<el-col :span="20">
  				<div class="grid-content bg-purple" align="center">
  					
  					<el-table :data="tableData" style="width: 100%">
  						<el-table-column prop="date" label="充值日期" width="180">
  						</el-table-column>
						
  						<el-table-column prop="name" label="姓名" width="180">
  						</el-table-column>
						
  						<el-table-column prop="address" label="地址" width="180">
  						</el-table-column>
  						
  						<el-table-column prop="electric" label="充值金额" width="180">
  						</el-table-column>
  						
						<el-table-column prop="total" label="当前总共金额" width="180">
						</el-table-column>
						
  					</el-table>					
  					
  				</div>
  		</el-col>
   
  </el-row>
  
  
  </div>
  
</template>

<script>
	
	export default{
		
		data(){
			
			return {
				id:1,
				category:2,
				tableData: []
			}
		},
		methods:{
			//查询相对应的信息
			 aaa(){
				 //自动加载
				 
				var str="id="+this.id+"&category=2"
				console.log(str)
				
				this.$axios({
					method:"POST",
					url:"/Convenience/RisingPricesHistory",
					data:str,
					
					// data:"id=1&category=2"
				}).then((res)=>{
					console.log(this.id)
					console.log("约吗")
					console.log(res.data)
					this.tableData=res.data;
					console.log(this.tableData)
					this.id&this.category
				})
				
				
				
			},
		},
		
		//自动加载初始化
		mounted: function(){
			this.aaa();//需要触发的函数
		},
		
	}
	
	
</script>

<style>
  .el-row {
    margin-bottom: 20px;
    &:last-child {
      margin-bottom: 0;
	  text-align: center;
    }
  }
  .el-col {
    border-radius: 4px;
  }
 /* .bg-purple-dark {
    background: #99a9bf;
  } */
  .bg-purple {
    background: #d3dce6;
  }
  /* .bg-purple-light {
    background: #e5e9f2;
  } */
  .grid-content {
    border-radius: 4px;
    min-height: 36px;
  }
/*  .row-bg {
    padding: 10px 0;
    background-color: #f9fafc;
  } */
</style>